/**
 * Copyright (c) 快宝网络 kuaidihelp.com Co., Ltd. All Rights Reserved 禁止外泄以及用于其它的商业用途
 */

import React, { useState, useEffect } from 'react';
import { Form, message, Modal } from 'antd';
import { approveTemplate, getTemplateAuditList, templateBlack } from '@/services/templateAudit';
import type { ApproveDataType, CommonIndexType } from '../types/Common';
import TemCommonCard from './common/TemCommonCard';
import TemRejectModal from './common/TemRejectModal';
import TemCommonForm from './common/TemCommonForm';
import { formatTemApproveParams, formatTemBlackParams, getRanString } from './utils';

// apply2approved - 从待批复到通过
// apply2reject - 从待批复到拒绝
// reject2approved - 从已拒绝到通过
// approved2reject - 从已通过到拒绝

const TemAudit = (props: CommonIndexType) => {
  const { screenSize, pageKey, show } = props;
  const [form] = Form.useForm();
  const [dataList, setDataList] = useState([]);
  const [pagination, setPagination] = useState({});
  const [resetSign, setResetSign] = useState('');
  const [modalProps, setModalProps] = useState({});

  // 获取列表
  const onFinish = async (opt: any) => {
    const { current } = opt || {};
    const formValues = form.getFieldsValue();
    const { dataList: list, pagination: paginationParams } = await getTemplateAuditList({
      page_num: current || 1,
      part: pageKey,
      ...formValues,
      state: 'indeterminate',
    });
    setDataList(list.map((item: ApproveDataType) => ({ ...item, ssid: getRanString() })));
    setPagination({ ...paginationParams });
    setResetSign(Date.now().toString());
  };

  useEffect(() => {
    if (show) {
      onFinish({});
    }
  }, [show]);

  // 通过 / 拒绝请求接口
  const onOperationApprove = async (params: any) => {
    const { result } = await approveTemplate(params);
    if (result) {
      message.info('操作成功');
      onFinish(pagination);
    }
  };

  const onOperationBlack = async (params: any) => {
    const { result } = await templateBlack(params);
    if (result) {
      message.info('操作成功');
      onFinish(pagination);
    }
  };

  //通过
  const onApprove = (data: ApproveDataType[]) => {
    const params = {
      state: 'apply2approved',
      ...formatTemApproveParams(data),
    };
    if (data.length > 1) {
      Modal.confirm({
        centered: true,
        content: `确认此${data.length}条数据批量通过？`,
        onOk: () => onOperationApprove(params),
      });
      return;
    }
    onOperationApprove(params);
  };
  // 拒绝
  const onRejact = (data: ApproveDataType) => {
    setModalProps({ visible: true, type: 'reject', ids: data, title: '请选择拒绝原因' });
  };

  // 拒绝并拉黑
  const onDrawBlack = (data: ApproveDataType) => {
    setModalProps({
      visible: true,
      type: 'black',
      ids: data,
      title: '温馨提示',
      width: screenSize ? 300 : 500,
    });
  };

  const onModalClose = () => {
    setModalProps({ visible: false });
  };

  const onModalHandele = (params: any) => {
    const { ids, type, reason } = params;
    if (type === 'reject') {
      onOperationApprove({
        state: 'apply2reject',
        reject_reason: reason,
        ...formatTemApproveParams([ids]),
      });
    }
    if (type === 'black') {
      onOperationBlack({
        reject_reason: reason,
        ...formatTemBlackParams(ids),
      });
    }
    onModalClose();
  };
  return (
    <>
      <TemCommonForm form={form} screenSize={screenSize} onFinish={onFinish} />
      <TemCommonCard
        pageKey={pageKey}
        dataSource={dataList}
        onApprove={onApprove}
        onRejact={onRejact}
        onDrawBlack={onDrawBlack}
        resetSign={resetSign}
        onPageChanges={onFinish}
        pagination={{
          ...pagination,
          pageSize: 10,
        }}
      />
      <TemRejectModal onCancel={onModalClose} onok={onModalHandele} {...modalProps} />
    </>
  );
};

export default TemAudit;
